<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Awesome-pyecharts</title>
            <script type="text/javascript" src="https://assets.pyecharts.org/assets/echarts.min.js"></script>
        <script type="text/javascript" src="https://assets.pyecharts.org/assets/maps/guang3_dong1_guang3_zhou1.js"></script>
        <script type="text/javascript" src="https://assets.pyecharts.org/assets/themes/purple-passion.js"></script>
        <script type="text/javascript" src="https://assets.pyecharts.org/assets/jquery.min.js"></script>
        <script type="text/javascript" src="https://assets.pyecharts.org/assets/jquery-ui.min.js"></script>
        <script type="text/javascript" src="https://assets.pyecharts.org/assets/ResizeSensor.js"></script>

            <link rel="stylesheet"  href="https://assets.pyecharts.org/assets/jquery-ui.css">

</head>
<body>
    <style>.box {  }; </style>
        <button onclick="downloadCfg()">Save Config</button>
    <div class="box">
                <div id="77d3dfacc1ac4d2ebcb0072684a646f7" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_77d3dfacc1ac4d2ebcb0072684a646f7 = echarts.init(
            document.getElementById('77d3dfacc1ac4d2ebcb0072684a646f7'), 'purple-passion', {renderer: 'canvas'});
        var option_77d3dfacc1ac4d2ebcb0072684a646f7 = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "pie",
            "clockwise": true,
            "data": [
                {
                    "name": "\u5929\u6cb3\u533a",
                    "value": 164
                },
                {
                    "name": "\u8d8a\u79c0\u533a",
                    "value": 69
                },
                {
                    "name": "\u6d77\u73e0\u533a",
                    "value": 68
                },
                {
                    "name": "\u8354\u6e7e\u533a",
                    "value": 27
                },
                {
                    "name": "\u756a\u79ba\u533a",
                    "value": 23
                },
                {
                    "name": "\u767d\u4e91\u533a",
                    "value": 20
                },
                {
                    "name": "\u9ec4\u57d4\u533a",
                    "value": 1
                }
            ],
            "radius": [
                "0%",
                "75%"
            ],
            "center": [
                "50%",
                "50%"
            ],
            "label": {
                "show": true,
                "position": "top",
                "margin": 8,
                "formatter": "{b}: {c}"
            }
        }
    ],
    "legend": [
        {
            "data": [
                "\u5929\u6cb3\u533a",
                "\u8d8a\u79c0\u533a",
                "\u6d77\u73e0\u533a",
                "\u8354\u6e7e\u533a",
                "\u756a\u79ba\u533a",
                "\u767d\u4e91\u533a",
                "\u9ec4\u57d4\u533a"
            ],
            "selected": {},
            "show": true,
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "title": [
        {
            "text": "\u884c\u653f\u533a\u7f8e\u98df\u5360\u6bd4",
            "padding": 5,
            "itemGap": 10
        }
    ]
};
        chart_77d3dfacc1ac4d2ebcb0072684a646f7.setOption(option_77d3dfacc1ac4d2ebcb0072684a646f7);
    </script>
<br/>                <div id="61396965445041279331cfabc8eb57e8" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_61396965445041279331cfabc8eb57e8 = echarts.init(
            document.getElementById('61396965445041279331cfabc8eb57e8'), 'purple-passion', {renderer: 'canvas'});
        var option_61396965445041279331cfabc8eb57e8 = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "bar",
            "legendHoverLink": true,
            "data": [
                60,
                42,
                34,
                23,
                22,
                10,
                10,
                10,
                10,
                10
            ],
            "showBackground": false,
            "barMinHeight": 0,
            "barCategoryGap": "20%",
            "barGap": "30%",
            "large": false,
            "largeThreshold": 400,
            "seriesLayoutBy": "column",
            "datasetIndex": 0,
            "clip": true,
            "zlevel": 0,
            "z": 2,
            "label": {
                "show": true,
                "position": "top",
                "margin": 8
            }
        }
    ],
    "legend": [
        {
            "data": [
                ""
            ],
            "selected": {
                "": true
            },
            "show": true,
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "xAxis": [
        {
            "show": true,
            "scale": false,
            "nameLocation": "end",
            "nameGap": 15,
            "gridIndex": 0,
            "axisLabel": {
                "show": true,
                "position": "top",
                "rotate": -15,
                "margin": 8
            },
            "inverse": false,
            "offset": 0,
            "splitNumber": 5,
            "minInterval": 0,
            "splitLine": {
                "show": false,
                "lineStyle": {
                    "show": true,
                    "width": 1,
                    "opacity": 1,
                    "curveness": 0,
                    "type": "solid"
                }
            },
            "data": [
                "\u73e0\u6c5f\u65b0\u57ce",
                "\u5929\u6cb3\u57ce/\u4f53\u80b2\u4e2d\u5fc3",
                "\u5317\u4eac\u8def",
                "\u6c5f\u5357\u897f",
                "\u5929\u6cb3\u5317",
                "\u673a\u573a\u8def",
                "\u6c5f\u5357\u5927\u9053",
                "\u9ad8\u5fb7\u7f6e\u5730/\u82b1\u57ce\u6c47",
                "\u77f3\u724c/\u9f99\u53e3",
                "\u5174\u76db\u8def/\u8dd1\u9a6c\u573a"
            ]
        }
    ],
    "yAxis": [
        {
            "show": true,
            "scale": false,
            "nameLocation": "end",
            "nameGap": 15,
            "gridIndex": 0,
            "inverse": false,
            "offset": 0,
            "splitNumber": 5,
            "minInterval": 0,
            "splitLine": {
                "show": false,
                "lineStyle": {
                    "show": true,
                    "width": 1,
                    "opacity": 1,
                    "curveness": 0,
                    "type": "solid"
                }
            }
        }
    ],
    "title": [
        {
            "text": "\u5546\u5708\u5206\u5e03",
            "padding": 5,
            "itemGap": 10
        }
    ]
};
        chart_61396965445041279331cfabc8eb57e8.setOption(option_61396965445041279331cfabc8eb57e8);
    </script>
<br/>                <div id="8942f571ea0d46c5a6579c46051d492f" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_8942f571ea0d46c5a6579c46051d492f = echarts.init(
            document.getElementById('8942f571ea0d46c5a6579c46051d492f'), 'purple-passion', {renderer: 'canvas'});
        var option_8942f571ea0d46c5a6579c46051d492f = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "pie",
            "clockwise": true,
            "data": [
                {
                    "name": "\u56db\u661f\u5546\u6237",
                    "value": 175
                },
                {
                    "name": "\u51c6\u4e94\u661f\u5546\u6237",
                    "value": 156
                },
                {
                    "name": "\u4e94\u661f\u5546\u6237",
                    "value": 34
                },
                {
                    "name": "\u51c6\u56db\u661f\u5546\u6237",
                    "value": 7
                }
            ],
            "radius": [
                "40%",
                "55%"
            ],
            "center": [
                "50%",
                "50%"
            ],
            "roseType": "area",
            "label": {
                "show": true,
                "position": "top",
                "margin": 8
            }
        }
    ],
    "legend": [
        {
            "data": [
                "\u56db\u661f\u5546\u6237",
                "\u51c6\u4e94\u661f\u5546\u6237",
                "\u4e94\u661f\u5546\u6237",
                "\u51c6\u56db\u661f\u5546\u6237"
            ],
            "selected": {},
            "show": true,
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "title": [
        {
            "text": "\u661f\u7ea7\u5360\u6bd4",
            "padding": 5,
            "itemGap": 10
        }
    ]
};
        chart_8942f571ea0d46c5a6579c46051d492f.setOption(option_8942f571ea0d46c5a6579c46051d492f);
    </script>
<br/>                <div id="b21b2e3c5d89498db499337ec9935f22" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_b21b2e3c5d89498db499337ec9935f22 = echarts.init(
            document.getElementById('b21b2e3c5d89498db499337ec9935f22'), 'purple-passion', {renderer: 'canvas'});
        var option_b21b2e3c5d89498db499337ec9935f22 = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "bar",
            "legendHoverLink": true,
            "data": [
                3,
                3,
                4,
                4,
                5,
                6,
                6,
                7,
                9,
                9,
                11,
                11,
                14,
                18,
                20,
                21,
                43,
                52,
                53,
                61
            ],
            "showBackground": false,
            "barMinHeight": 0,
            "barCategoryGap": "20%",
            "barGap": "30%",
            "large": false,
            "largeThreshold": 400,
            "seriesLayoutBy": "column",
            "datasetIndex": 0,
            "clip": true,
            "zlevel": 0,
            "z": 2,
            "label": {
                "show": true,
                "position": "right",
                "margin": 8
            }
        }
    ],
    "legend": [
        {
            "data": [
                ""
            ],
            "selected": {
                "": true
            },
            "show": true,
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "xAxis": [
        {
            "show": true,
            "scale": false,
            "nameLocation": "end",
            "nameGap": 15,
            "gridIndex": 0,
            "inverse": false,
            "offset": 0,
            "splitNumber": 5,
            "minInterval": 0,
            "splitLine": {
                "show": false,
                "lineStyle": {
                    "show": true,
                    "width": 1,
                    "opacity": 1,
                    "curveness": 0,
                    "type": "solid"
                }
            }
        }
    ],
    "yAxis": [
        {
            "show": true,
            "scale": false,
            "nameLocation": "end",
            "nameGap": 15,
            "gridIndex": 0,
            "inverse": false,
            "offset": 0,
            "splitNumber": 5,
            "minInterval": 0,
            "splitLine": {
                "show": false,
                "lineStyle": {
                    "show": true,
                    "width": 1,
                    "opacity": 1,
                    "curveness": 0,
                    "type": "solid"
                }
            },
            "data": [
                "\u6c5f\u6d59\u83dc",
                "\u8336\u9910\u9986",
                "\u5c0f\u9f99\u867e",
                "\u6d77\u9c9c",
                "\u7d20\u83dc",
                "\u6e58\u83dc",
                "\u97e9\u5f0f\u6599\u7406",
                "\u521b\u610f\u83dc",
                "\u97e9\u56fd\u6599\u7406",
                "\u8336\u9910\u5385",
                "\u5ddd\u83dc",
                "\u4e1c\u5357\u4e9a\u83dc",
                "\u5496\u5561\u5385",
                "\u70e7\u70e4",
                "\u81ea\u52a9\u9910",
                "\u9762\u5305\u751c\u70b9",
                "\u706b\u9505",
                "\u65e5\u672c\u6599\u7406",
                "\u7ca4\u83dc",
                "\u897f\u9910"
            ]
        }
    ],
    "title": [
        {
            "text": "\u7f8e\u98df\u79cd\u7c7b\u5206\u5e03",
            "padding": 5,
            "itemGap": 10
        }
    ]
};
        chart_b21b2e3c5d89498db499337ec9935f22.setOption(option_b21b2e3c5d89498db499337ec9935f22);
    </script>
<br/>                <div id="7ecdd15281234448ae4106fc5675d2d8" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_7ecdd15281234448ae4106fc5675d2d8 = echarts.init(
            document.getElementById('7ecdd15281234448ae4106fc5675d2d8'), 'purple-passion', {renderer: 'canvas'});
        var option_7ecdd15281234448ae4106fc5675d2d8 = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "heatmap",
            "data": [
                [
                    0,
                    0,
                    1.0
                ],
                [
                    0,
                    1,
                    0.04
                ],
                [
                    0,
                    2,
                    -0.07
                ],
                [
                    0,
                    3,
                    -0.05
                ],
                [
                    0,
                    4,
                    -0.28
                ],
                [
                    1,
                    0,
                    0.04
                ],
                [
                    1,
                    1,
                    1.0
                ],
                [
                    1,
                    2,
                    0.13
                ],
                [
                    1,
                    3,
                    0.4
                ],
                [
                    1,
                    4,
                    0.33
                ],
                [
                    2,
                    0,
                    -0.07
                ],
                [
                    2,
                    1,
                    0.13
                ],
                [
                    2,
                    2,
                    1.0
                ],
                [
                    2,
                    3,
                    0.25
                ],
                [
                    2,
                    4,
                    0.52
                ],
                [
                    3,
                    0,
                    -0.05
                ],
                [
                    3,
                    1,
                    0.4
                ],
                [
                    3,
                    2,
                    0.25
                ],
                [
                    3,
                    3,
                    1.0
                ],
                [
                    3,
                    4,
                    0.68
                ],
                [
                    4,
                    0,
                    -0.28
                ],
                [
                    4,
                    1,
                    0.33
                ],
                [
                    4,
                    2,
                    0.52
                ],
                [
                    4,
                    3,
                    0.68
                ],
                [
                    4,
                    4,
                    1.0
                ]
            ],
            "label": {
                "show": true,
                "position": "inside",
                "margin": 8
            }
        }
    ],
    "legend": [
        {
            "data": [
                ""
            ],
            "selected": {
                "": true
            },
            "show": true,
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "xAxis": [
        {
            "show": true,
            "scale": false,
            "nameLocation": "end",
            "nameGap": 15,
            "gridIndex": 0,
            "inverse": false,
            "offset": 0,
            "splitNumber": 5,
            "minInterval": 0,
            "splitLine": {
                "show": false,
                "lineStyle": {
                    "show": true,
                    "width": 1,
                    "opacity": 1,
                    "curveness": 0,
                    "type": "solid"
                }
            },
            "data": [
                "\u8bc4\u8bba\u6570",
                "\u4eba\u5747\u4ef7\u683c",
                "\u53e3\u5473\u8bc4\u5206",
                "\u73af\u5883\u8bc4\u5206",
                "\u670d\u52a1\u8bc4\u5206"
            ]
        }
    ],
    "yAxis": [
        {
            "show": true,
            "scale": false,
            "nameLocation": "end",
            "nameGap": 15,
            "gridIndex": 0,
            "inverse": false,
            "offset": 0,
            "splitNumber": 5,
            "minInterval": 0,
            "splitLine": {
                "show": false,
                "lineStyle": {
                    "show": true,
                    "width": 1,
                    "opacity": 1,
                    "curveness": 0,
                    "type": "solid"
                }
            },
            "data": [
                "\u8bc4\u8bba\u6570",
                "\u4eba\u5747\u4ef7\u683c",
                "\u53e3\u5473\u8bc4\u5206",
                "\u73af\u5883\u8bc4\u5206",
                "\u670d\u52a1\u8bc4\u5206"
            ]
        }
    ],
    "title": [
        {
            "text": "\u4ef7\u683c\u53e3\u7891\u7b49\u76f8\u5173\u6027",
            "padding": 5,
            "itemGap": 10
        }
    ],
    "visualMap": {
        "show": false,
        "type": "continuous",
        "min": -1,
        "max": 1,
        "inRange": {
            "color": [
                "#50a3ba",
                "#eac763",
                "#d94e5d"
            ]
        },
        "calculable": true,
        "inverse": false,
        "splitNumber": 5,
        "orient": "vertical",
        "showLabel": true,
        "itemWidth": 20,
        "itemHeight": 140,
        "borderWidth": 0
    }
};
        chart_7ecdd15281234448ae4106fc5675d2d8.setOption(option_7ecdd15281234448ae4106fc5675d2d8);
    </script>
<br/>                <div id="74c9da272ad441139c9f7c31f56ed405" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_74c9da272ad441139c9f7c31f56ed405 = echarts.init(
            document.getElementById('74c9da272ad441139c9f7c31f56ed405'), 'purple-passion', {renderer: 'canvas'});
        var option_74c9da272ad441139c9f7c31f56ed405 = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "map",
            "label": {
                "show": true,
                "position": "top",
                "margin": 8
            },
            "mapType": "\u5e7f\u5dde",
            "data": [
                {
                    "name": "\u5929\u6cb3\u533a",
                    "value": 164
                },
                {
                    "name": "\u8d8a\u79c0\u533a",
                    "value": 69
                },
                {
                    "name": "\u6d77\u73e0\u533a",
                    "value": 68
                },
                {
                    "name": "\u8354\u6e7e\u533a",
                    "value": 27
                },
                {
                    "name": "\u756a\u79ba\u533a",
                    "value": 23
                },
                {
                    "name": "\u767d\u4e91\u533a",
                    "value": 20
                },
                {
                    "name": "\u9ec4\u57d4\u533a",
                    "value": 1
                }
            ],
            "roam": true,
            "aspectScale": 0.75,
            "nameProperty": "name",
            "selectedMode": false,
            "zoom": 1,
            "mapValueCalculation": "sum",
            "showLegendSymbol": true,
            "emphasis": {}
        }
    ],
    "legend": [
        {
            "data": [
                ""
            ],
            "selected": {
                "": true
            },
            "show": true,
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "title": [
        {
            "text": "\u5e7f\u5dde\u7f8e\u98df\u5206\u5e03",
            "padding": 5,
            "itemGap": 10
        }
    ],
    "visualMap": {
        "show": true,
        "type": "continuous",
        "min": 0,
        "max": 100,
        "inRange": {
            "color": [
                "#50a3ba",
                "#eac763",
                "#d94e5d"
            ]
        },
        "calculable": true,
        "inverse": false,
        "splitNumber": 5,
        "orient": "vertical",
        "showLabel": true,
        "itemWidth": 20,
        "itemHeight": 140,
        "borderWidth": 0
    }
};
        chart_74c9da272ad441139c9f7c31f56ed405.setOption(option_74c9da272ad441139c9f7c31f56ed405);
    </script>
<br/>                <div id="996ff074453249b8b1ee89d126cfd1d1" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_996ff074453249b8b1ee89d126cfd1d1 = echarts.init(
            document.getElementById('996ff074453249b8b1ee89d126cfd1d1'), 'purple-passion', {renderer: 'canvas'});
        var option_996ff074453249b8b1ee89d126cfd1d1 = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "radar",
            "name": "\u56db\u661f\u5546\u6237",
            "data": [
                [
                    4.1,
                    4.2,
                    3.7,
                    4.5,
                    4.2
                ]
            ],
            "label": {
                "show": false,
                "position": "top",
                "margin": 8
            },
            "itemStyle": {
                "normal": {
                    "color": "#6495ed"
                }
            },
            "lineStyle": {
                "show": true,
                "width": 1,
                "opacity": 1,
                "curveness": 0,
                "type": "solid"
            },
            "areaStyle": {
                "opacity": 0.1
            }
        },
        {
            "type": "radar",
            "name": "\u51c6\u4e94\u661f\u5546\u6237",
            "data": [
                [
                    4.5,
                    4.7,
                    4.2,
                    4.5,
                    4.8
                ]
            ],
            "label": {
                "show": false,
                "position": "top",
                "margin": 8
            },
            "itemStyle": {
                "normal": {
                    "color": "#696969"
                }
            },
            "lineStyle": {
                "show": true,
                "width": 1,
                "opacity": 1,
                "curveness": 0,
                "type": "solid"
            },
            "areaStyle": {
                "opacity": 0.1
            }
        },
        {
            "type": "radar",
            "name": "\u4e94\u661f\u5546\u6237",
            "data": [
                [
                    4.6,
                    4.9,
                    4.9,
                    5,
                    4.3
                ]
            ],
            "label": {
                "show": false,
                "position": "top",
                "margin": 8
            },
            "itemStyle": {
                "normal": {
                    "color": "#3cb371"
                }
            },
            "lineStyle": {
                "show": true,
                "width": 1,
                "opacity": 1,
                "curveness": 0,
                "type": "solid"
            },
            "areaStyle": {
                "opacity": 0.1
            }
        },
        {
            "type": "radar",
            "name": "\u51c6\u56db\u661f\u5546\u6237",
            "data": [
                [
                    4.3,
                    3.7,
                    4.1,
                    4.1,
                    4.6
                ]
            ],
            "label": {
                "show": false,
                "position": "top",
                "margin": 8
            },
            "itemStyle": {
                "normal": {
                    "color": "#ff8c00"
                }
            },
            "lineStyle": {
                "show": true,
                "width": 1,
                "opacity": 1,
                "curveness": 0,
                "type": "solid"
            },
            "areaStyle": {
                "opacity": 0.1
            }
        }
    ],
    "legend": [
        {
            "data": [
                "\u56db\u661f\u5546\u6237",
                "\u51c6\u4e94\u661f\u5546\u6237",
                "\u4e94\u661f\u5546\u6237",
                "\u51c6\u56db\u661f\u5546\u6237"
            ],
            "selected": {
                "\u56db\u661f\u5546\u6237": true,
                "\u51c6\u4e94\u661f\u5546\u6237": true,
                "\u4e94\u661f\u5546\u6237": true,
                "\u51c6\u56db\u661f\u5546\u6237": true
            },
            "show": true,
            "orient": "horizontal",
            "align": "left",
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "title": [
        {
            "text": "\u661f\u7ea7\u5546\u94fa\u8bc4\u5206",
            "padding": 5,
            "itemGap": 10
        }
    ],
    "radar": {
        "indicator": [
            {
                "name": "\u83dc\u4ef7\u83dc\u91cf",
                "max": 5
            },
            {
                "name": "\u53e3\u5473",
                "max": 5
            },
            {
                "name": "\u73af\u5883",
                "max": 5
            },
            {
                "name": "\u670d\u52a1",
                "max": 5
            },
            {
                "name": "\u4ea4\u901a",
                "max": 5
            }
        ],
        "name": {
            "textStyle": {}
        },
        "splitLine": {
            "show": true,
            "lineStyle": {
                "show": true,
                "width": 1,
                "opacity": 1,
                "curveness": 0,
                "type": "solid"
            }
        },
        "splitArea": {
            "show": true,
            "areaStyle": {
                "opacity": 0
            }
        },
        "axisLine": {
            "show": true,
            "onZero": true,
            "onZeroAxisIndex": 0
        }
    }
};
        chart_996ff074453249b8b1ee89d126cfd1d1.setOption(option_996ff074453249b8b1ee89d126cfd1d1);
    </script>
<br/>                <div id="8b235cbdbe5743589ce70b765226c52d" class="chart-container" style="width:900px; height:500px;"></div>
    <script>
        var chart_8b235cbdbe5743589ce70b765226c52d = echarts.init(
            document.getElementById('8b235cbdbe5743589ce70b765226c52d'), 'purple-passion', {renderer: 'canvas'});
        var option_8b235cbdbe5743589ce70b765226c52d = {
    "animation": true,
    "animationThreshold": 2000,
    "animationDuration": 1000,
    "animationEasing": "cubicOut",
    "animationDelay": 0,
    "animationDurationUpdate": 300,
    "animationEasingUpdate": "cubicOut",
    "animationDelayUpdate": 0,
    "series": [
        {
            "type": "graph",
            "layout": "circular",
            "symbolSize": 10,
            "circular": {
                "rotateLabel": true
            },
            "force": {
                "repulsion": 50,
                "edgeLength": 50,
                "gravity": 0.2
            },
            "label": {
                "show": true,
                "position": "top",
                "margin": 8
            },
            "lineStyle": {
                "show": true,
                "width": 1,
                "opacity": 1,
                "curveness": 0.3,
                "type": "solid",
                "color": "source"
            },
            "roam": true,
            "draggable": false,
            "focusNodeAdjacency": true,
            "data": [
                {
                    "id": "\u56db\u661f\u5546\u6237",
                    "name": "\u56db\u661f\u5546\u6237",
                    "category": 0,
                    "symbolSize": 30
                },
                {
                    "id": "\u51c6\u4e94\u661f\u5546\u6237",
                    "name": "\u51c6\u4e94\u661f\u5546\u6237",
                    "category": 1,
                    "symbolSize": 30
                },
                {
                    "id": "\u4e94\u661f\u5546\u6237",
                    "name": "\u4e94\u661f\u5546\u6237",
                    "category": 2,
                    "symbolSize": 30
                },
                {
                    "id": "\u51c6\u56db\u661f\u5546\u6237",
                    "name": "\u51c6\u56db\u661f\u5546\u6237",
                    "category": 3,
                    "symbolSize": 30
                },
                {
                    "id": "Mr Pilot\u98de\u884c\u5148\u751f",
                    "name": "Mr Pilot\u98de\u884c\u5148\u751f",
                    "category": 0,
                    "symbolSize": 10
                },
                {
                    "id": "\u9999\u8349\u70e4\u571f\u8c46",
                    "name": "\u9999\u8349\u70e4\u571f\u8c46",
                    "category": 0,
                    "symbolSize": 10
                },
                {
                    "id": "\u9999\u4f2f\u7235\u81ea\u52a9\u9910\u5385",
                    "name": "\u9999\u4f2f\u7235\u81ea\u52a9\u9910\u5385",
                    "category": 0,
                    "symbolSize": 10
                },
                {
                    "id": "\u4e09\u6587\u9c7c\u523a\u8eab",
                    "name": "\u4e09\u6587\u9c7c\u523a\u8eab",
                    "category": 0,
                    "symbolSize": 10
                },
                {
                    "id": "\u4f6c\u9ebb\u96c0",
                    "name": "\u4f6c\u9ebb\u96c0",
                    "category": 0,
                    "symbolSize": 10
                },
                {
                    "id": "\u91d1\u6c99\u7ea2\u7c73\u80a0",
                    "name": "\u91d1\u6c99\u7ea2\u7c73\u80a0",
                    "category": 0,
                    "symbolSize": 10
                },
                {
                    "id": "\u9ad8\u5361\u4e00\u756a\u65e5\u672c\u6599\u7406",
                    "name": "\u9ad8\u5361\u4e00\u756a\u65e5\u672c\u6599\u7406",
                    "category": 1,
                    "symbolSize": 10
                },
                {
                    "id": "\u829d\u58eb\u725b\u820c",
                    "name": "\u829d\u58eb\u725b\u820c",
                    "category": 1,
                    "symbolSize": 10
                },
                {
                    "id": "Cocina\u79d1\u5947\u5a1c\u00b7\u5357\u7f8e\u521b\u610f\u6599\u7406",
                    "name": "Cocina\u79d1\u5947\u5a1c\u00b7\u5357\u7f8e\u521b\u610f\u6599\u7406",
                    "category": 1,
                    "symbolSize": 10
                },
                {
                    "id": "\u725b\u8089\u5bff\u53f8",
                    "name": "\u725b\u8089\u5bff\u53f8",
                    "category": 1,
                    "symbolSize": 10
                },
                {
                    "id": "Ebony",
                    "name": "Ebony",
                    "category": 1,
                    "symbolSize": 10
                },
                {
                    "id": "\u70df\u4e09\u6587\u9c7c\u6c99\u62c9",
                    "name": "\u70df\u4e09\u6587\u9c7c\u6c99\u62c9",
                    "category": 1,
                    "symbolSize": 10
                },
                {
                    "id": "\u795e\u9690\u9152\u573a",
                    "name": "\u795e\u9690\u9152\u573a",
                    "category": 2,
                    "symbolSize": 10
                },
                {
                    "id": "\u73ab\u7470\u9732\u9152\u716e\u6d77\u87ba",
                    "name": "\u73ab\u7470\u9732\u9152\u716e\u6d77\u87ba",
                    "category": 2,
                    "symbolSize": 10
                },
                {
                    "id": "\u6e14\u610f\u5982\u610f",
                    "name": "\u6e14\u610f\u5982\u610f",
                    "category": 2,
                    "symbolSize": 10
                },
                {
                    "id": "\u4e00\u9c7c\u4e94\u98df",
                    "name": "\u4e00\u9c7c\u4e94\u98df",
                    "category": 2,
                    "symbolSize": 10
                },
                {
                    "id": "\u56db\u6d77\u4e00\u5bb6",
                    "name": "\u56db\u6d77\u4e00\u5bb6",
                    "category": 2,
                    "symbolSize": 10
                },
                {
                    "id": "\u78b3\u70e7\u751f\u869d",
                    "name": "\u78b3\u70e7\u751f\u869d",
                    "category": 2,
                    "symbolSize": 10
                },
                {
                    "id": "RIBS\u4e50\u6392\u9986",
                    "name": "RIBS\u4e50\u6392\u9986",
                    "category": 3,
                    "symbolSize": 10
                },
                {
                    "id": "\u548c\u725b\u725b\u8169",
                    "name": "\u548c\u725b\u725b\u8169",
                    "category": 3,
                    "symbolSize": 10
                },
                {
                    "id": "98\u519c\u5e84",
                    "name": "98\u519c\u5e84",
                    "category": 3,
                    "symbolSize": 10
                },
                {
                    "id": "\u70ad\u70e7\u725b\u86d9\u7d2b\u82cf\u5473\u5e73\u9505",
                    "name": "\u70ad\u70e7\u725b\u86d9\u7d2b\u82cf\u5473\u5e73\u9505",
                    "category": 3,
                    "symbolSize": 10
                },
                {
                    "id": "\u60a6\u6995\u5e84",
                    "name": "\u60a6\u6995\u5e84",
                    "category": 3,
                    "symbolSize": 10
                },
                {
                    "id": "\u4f5b\u8df3\u5899",
                    "name": "\u4f5b\u8df3\u5899",
                    "category": 3,
                    "symbolSize": 10
                }
            ],
            "categories": [
                {
                    "name": "\u56db\u661f\u63a8\u8350"
                },
                {
                    "name": "\u51c6\u4e94\u661f\u63a8\u8350"
                },
                {
                    "name": "\u4e94\u661f\u63a8\u8350"
                },
                {
                    "name": "\u51c6\u56db\u661f\u63a8\u8350"
                }
            ],
            "edgeLabel": {
                "show": false,
                "position": "top",
                "margin": 8
            },
            "edgeSymbol": [
                null,
                null
            ],
            "edgeSymbolSize": 10,
            "links": [
                {
                    "source": "\u56db\u661f\u5546\u6237",
                    "target": "Mr Pilot\u98de\u884c\u5148\u751f"
                },
                {
                    "source": "\u56db\u661f\u5546\u6237",
                    "target": "\u9999\u4f2f\u7235\u81ea\u52a9\u9910\u5385"
                },
                {
                    "source": "\u56db\u661f\u5546\u6237",
                    "target": "\u4f6c\u9ebb\u96c0"
                },
                {
                    "source": "\u51c6\u4e94\u661f\u5546\u6237",
                    "target": "\u9ad8\u5361\u4e00\u756a\u65e5\u672c\u6599\u7406"
                },
                {
                    "source": "\u51c6\u4e94\u661f\u5546\u6237",
                    "target": "Cocina\u79d1\u5947\u5a1c\u00b7\u5357\u7f8e\u521b\u610f\u6599\u7406"
                },
                {
                    "source": "\u51c6\u4e94\u661f\u5546\u6237",
                    "target": "Ebony"
                },
                {
                    "source": "\u4e94\u661f\u5546\u6237",
                    "target": "\u795e\u9690\u9152\u573a"
                },
                {
                    "source": "\u4e94\u661f\u5546\u6237",
                    "target": "\u6e14\u610f\u5982\u610f"
                },
                {
                    "source": "\u4e94\u661f\u5546\u6237",
                    "target": "\u56db\u6d77\u4e00\u5bb6"
                },
                {
                    "source": "\u51c6\u56db\u661f\u5546\u6237",
                    "target": "RIBS\u4e50\u6392\u9986"
                },
                {
                    "source": "\u51c6\u56db\u661f\u5546\u6237",
                    "target": "98\u519c\u5e84"
                },
                {
                    "source": "\u51c6\u56db\u661f\u5546\u6237",
                    "target": "\u60a6\u6995\u5e84"
                },
                {
                    "source": "Mr Pilot\u98de\u884c\u5148\u751f",
                    "target": "\u9999\u8349\u70e4\u571f\u8c46"
                },
                {
                    "source": "\u9999\u4f2f\u7235\u81ea\u52a9\u9910\u5385",
                    "target": "\u4e09\u6587\u9c7c\u523a\u8eab"
                },
                {
                    "source": "\u4f6c\u9ebb\u96c0",
                    "target": "\u91d1\u6c99\u7ea2\u7c73\u80a0"
                },
                {
                    "source": "\u9ad8\u5361\u4e00\u756a\u65e5\u672c\u6599\u7406",
                    "target": "\u829d\u58eb\u725b\u820c"
                },
                {
                    "source": "Cocina\u79d1\u5947\u5a1c\u00b7\u5357\u7f8e\u521b\u610f\u6599\u7406",
                    "target": "\u725b\u8089\u5bff\u53f8"
                },
                {
                    "source": "Ebony",
                    "target": "\u70df\u4e09\u6587\u9c7c\u6c99\u62c9"
                },
                {
                    "source": "\u795e\u9690\u9152\u573a",
                    "target": "\u73ab\u7470\u9732\u9152\u716e\u6d77\u87ba"
                },
                {
                    "source": "\u6e14\u610f\u5982\u610f",
                    "target": "\u4e00\u9c7c\u4e94\u98df"
                },
                {
                    "source": "\u56db\u6d77\u4e00\u5bb6",
                    "target": "\u78b3\u70e7\u751f\u869d"
                },
                {
                    "source": "RIBS\u4e50\u6392\u9986",
                    "target": "\u548c\u725b\u725b\u8169"
                },
                {
                    "source": "98\u519c\u5e84",
                    "target": "\u70ad\u70e7\u725b\u86d9\u7d2b\u82cf\u5473\u5e73\u9505"
                },
                {
                    "source": "\u60a6\u6995\u5e84",
                    "target": "\u4f5b\u8df3\u5899"
                }
            ]
        }
    ],
    "legend": [
        {
            "data": [
                "\u56db\u661f\u63a8\u8350",
                "\u51c6\u4e94\u661f\u63a8\u8350",
                "\u4e94\u661f\u63a8\u8350",
                "\u51c6\u56db\u661f\u63a8\u8350"
            ],
            "selected": {
                "\u56db\u661f\u63a8\u8350": true,
                "\u51c6\u4e94\u661f\u63a8\u8350": true,
                "\u4e94\u661f\u63a8\u8350": true,
                "\u51c6\u56db\u661f\u63a8\u8350": true
            },
            "show": true,
            "left": "3%",
            "top": "20%",
            "orient": "vertical",
            "padding": 5,
            "itemGap": 10,
            "itemWidth": 25,
            "itemHeight": 14
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "showContent": true,
        "alwaysShowContent": false,
        "showDelay": 0,
        "hideDelay": 100,
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0,
        "padding": 5
    },
    "title": [
        {
            "text": "\u661f\u7ea7\u63a8\u8350",
            "padding": 5,
            "itemGap": 10
        }
    ]
};
        chart_8b235cbdbe5743589ce70b765226c52d.setOption(option_8b235cbdbe5743589ce70b765226c52d);
    </script>
<br/>    </div>
    <script>
            $('#77d3dfacc1ac4d2ebcb0072684a646f7').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#77d3dfacc1ac4d2ebcb0072684a646f7>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#77d3dfacc1ac4d2ebcb0072684a646f7'), function() { chart_77d3dfacc1ac4d2ebcb0072684a646f7.resize()});
            $('#61396965445041279331cfabc8eb57e8').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#61396965445041279331cfabc8eb57e8>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#61396965445041279331cfabc8eb57e8'), function() { chart_61396965445041279331cfabc8eb57e8.resize()});
            $('#8942f571ea0d46c5a6579c46051d492f').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#8942f571ea0d46c5a6579c46051d492f>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#8942f571ea0d46c5a6579c46051d492f'), function() { chart_8942f571ea0d46c5a6579c46051d492f.resize()});
            $('#b21b2e3c5d89498db499337ec9935f22').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#b21b2e3c5d89498db499337ec9935f22>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#b21b2e3c5d89498db499337ec9935f22'), function() { chart_b21b2e3c5d89498db499337ec9935f22.resize()});
            $('#7ecdd15281234448ae4106fc5675d2d8').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#7ecdd15281234448ae4106fc5675d2d8>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#7ecdd15281234448ae4106fc5675d2d8'), function() { chart_7ecdd15281234448ae4106fc5675d2d8.resize()});
            $('#74c9da272ad441139c9f7c31f56ed405').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#74c9da272ad441139c9f7c31f56ed405>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#74c9da272ad441139c9f7c31f56ed405'), function() { chart_74c9da272ad441139c9f7c31f56ed405.resize()});
            $('#996ff074453249b8b1ee89d126cfd1d1').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#996ff074453249b8b1ee89d126cfd1d1>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#996ff074453249b8b1ee89d126cfd1d1'), function() { chart_996ff074453249b8b1ee89d126cfd1d1.resize()});
            $('#8b235cbdbe5743589ce70b765226c52d').resizable().draggable().css('border-style', 'dashed').css('border-width', '1px');$("#8b235cbdbe5743589ce70b765226c52d>div:nth-child(1)").width("100%").height("100%");
            new ResizeSensor(jQuery('#8b235cbdbe5743589ce70b765226c52d'), function() { chart_8b235cbdbe5743589ce70b765226c52d.resize()});
            var charts_id = ['77d3dfacc1ac4d2ebcb0072684a646f7','61396965445041279331cfabc8eb57e8','8942f571ea0d46c5a6579c46051d492f','b21b2e3c5d89498db499337ec9935f22','7ecdd15281234448ae4106fc5675d2d8','74c9da272ad441139c9f7c31f56ed405','996ff074453249b8b1ee89d126cfd1d1','8b235cbdbe5743589ce70b765226c52d'];
function downloadCfg () {
    const fileName = 'chart_config.json'
    let downLink = document.createElement('a')
    downLink.download = fileName

    let result = []
    for(let i=0; i<charts_id.length; i++) {
        chart = $('#'+charts_id[i])
        result.push({
            cid: charts_id[i],
            width: chart.css("width"),
            height: chart.css("height"),
            top: chart.offset().top + "px",
            left: chart.offset().left + "px"
        })
    }

    let blob = new Blob([JSON.stringify(result)])
    downLink.href = URL.createObjectURL(blob)
    document.body.appendChild(downLink)
    downLink.click()
    document.body.removeChild(downLink)
}
    </script>
</body>
</html>
